<template>
  <div>
   <van-nav-bar title="会员充值"
                 left-text="返回"
                 left-arrow
                 @click-left="onClickLeft" />
    <van-card v-for="(item,index) in data"
              :key="index"
              :price="item.recharge.toFixed(2)"
              :desc="item.settingsLabel"
              :title="item.name"
              thumb="https://uchihashiamu.obs.cn-east-3.myhuaweicloud.com/recharge.png">
      <template #tags
                v-if="item.configType===1">
        <van-tag plain
                 type="danger">会员限定</van-tag>
      </template>
      <template #footer>
        <van-button color="#7232dd"
                    @click="goumai(item)">购买</van-button>

      </template>
    </van-card>
    <van-action-sheet v-model="actionSheetShow"
                      :actions="actions"
                      @select="onSelect" />

  </div>
</template>
<script>
import { stringifyScs } from '@/api/request'
import { getMemberRechargeRuleList ,prepay} from '@/api/memberRechargeRule'
import { finishPay } from '@/api/PaymentTest'
import { Toast } from 'vant';
export default {
  components: {},
  props: {},
  data () {
    return {
      active: 'me',
      scs: [
        {

        }
      ], pc: {
        pageIndex: 1,
        pageSize: 200,
        total: 0
      }, filters: {
        state:1,
        keyword: ''
      },
      data: [],
      memberCardSelected: {},
      actions: [{ name: '微信支付' }, { name: '支付宝支付' }, { name: '银行支付' }],
      actionSheetShow: false
    }
  },

  computed: {},
  watch: {},
  methods: {
    load () {
      const paging = {
        p: this.pc.pageIndex,
        s: this.pc.pageSize
      };
      const filters = Object.assign(paging, this.filters, { scs: stringifyScs(this.scs) });
      getMemberRechargeRuleList(filters).then(res => {

        this.data = res.data.data.records
        console.log(this.data)
      })

    },
    onClickLeft () {
      this.$router.push({
        path: '/me'
      })
    },
    goumai (v) {
      console.log("点击购买：", v)
      this.memberCardSelected = v
      this.actionSheetShow = true
    },
    onSelect (item) {
      // 默认情况下点击选项时不会自动收起
      // 可以通过 close-on-click-action 属性开启自动收起
      const gid = this.memberCardSelected.id
      if (item.name !== '微信支付')
      {
        Toast("当前只支持微信支付");

      } else
      {
        let orderId;
        prepay({ memberRechargeRuleId: gid }).then(res => {
          if (res.data.code === 100200)
          {
            orderId = res.data.data.id
            finishPay({ orderId: orderId }).then(res => {
              if (res.data.code === 100200)
              {
                Toast("会员卡购买成功");
                this.actionSheetShow = false;
              } else
              {
                Toast(res.data.message);
              }
            })
          } else
          {
            Toast(res.data.message);
          }

        })


      }


    },
  },
  created () {
    this.load()
  },
  mounted () { },
  beforeCreate () { },
  beforeMount () { },
  beforeUpdate () { },
  updated () { },
  beforeDestroy () { },
  destroyed () { },
  activated () { }
}
</script>
<style lang='less'>
</style>